// pages/vsAnimation /vsAnimation.js
const app = getApp()

Page({

  /**
   * 页面的初始数据
   */
  data: {
    exitState:"",
    times:"",
    zindex:0,
    matchType:"",
    ownInfo: {},
    opponentInfo: {},
    animate1:{}, //动画一
    animate2:{}, //动画二
    animateScale:{}, //vs动画三
    userName: "澄邈、德泽、海超、海阳、海荣、海逸、海昌、瀚钰、瀚文、涵亮、涵煦、涵蓄、涵衍、浩皛、浩波、浩博、浩初、浩宕、浩歌、浩广、浩邈、浩气、浩思、浩言、鸿宝、鸿波、鸿博、鸿才、鸿畅、鸿畴、鸿达、鸿德、鸿飞、鸿风、鸿福、鸿光、鸿晖、鸿朗、鸿文、鸿轩、鸿煊、鸿骞、鸿远、鸿云、鸿哲、鸿祯、鸿志、鸿卓、嘉澍"
  },

  onShow() {
    let animation = wx.createAnimation({
      duration: 500,
      timingFunction: 'ease',
      transformOrigin:'50% 50% 0'
    })

    // this.animation = animation  

    animation.translate(0, 0).step()
    this.setData({
      animate1: animation.export()
    })

    let animation2 = wx.createAnimation({
      duration: 500,
      timingFunction: 'ease',
      transformOrigin: '50% 50% 0',
      delay:500
    })

    animation2.translate(0, 0).opacity(1).step()
    this.setData({
      animate2: animation2.export()
    })

    //animateScale
    let animation3 = wx.createAnimation({
      duration: 800,
      timingFunction: 'ease',
      transformOrigin: '50% 50% 0',
      delay:1000
    })

    animation3.scale(1).opacity(1).step()
    this.setData({
      animateScale: animation3.export()
    })
  },

  timeFn() {
    return new Promise((resolve, reject) => {
      clearInterval(this.data.times)
      this.data.times = setInterval(() => {
        if (this.data.zindex >= 3) {
          resolve(true)
        } else {
          this.setData({
            zindex: this.data.zindex + 1
          })
        }
      }, 1000)
    })
  },

  // 页面离开
  onHide: function () {
    if (this.data.exitState !== 'start') {
      wx.closeSocket((res) => {
        console.log('WebSocket 已关闭！')
      })

      wx.redirectTo({
        url: `/pages/index/index`
      })
    }
  },

  onUnload:function() {
    if (this.data.exitState !== 'start') {
      wx.closeSocket((res) => {
        console.log('WebSocket 已关闭！')
      })

      wx.redirectTo({
        url: `/pages/index/index`
      })
    }
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    // 发起者信息
    this.setData({
      ownInfo: app.globalData.ownInfo
    })
    // 获取是否人机还是对战
    this.setData({
      matchType: app.globalData.matchType
    })
    // 应战者信息
    if (this.data.matchType == 'machine') {
      let iarr = this.data.userName.split('、')
      let param = {
        avatarUrl: "../../images/oneTwo.png",
        name: iarr[Math.round(Math.random() * iarr.length - 1)],
        winCount: Math.round(Math.random() * Number(this.data.ownInfo.winCount))
      }

      this.setData({
        opponentInfo: param
      })

      app.globalData.opponentInfo = param

    } else {
      this.setData({
        opponentInfo: app.globalData.opponentInfo
      })
    }

    this.timeFn().then((v)=>{
      clearInterval(this.data.times)
      
      this.setData({
        'exitState':'start'
      })

      wx.redirectTo({
        url: `/pages/officialAnswer/officialAnswer`
      })
    })


    // 检测断线状态
    wx.onSocketMessage((data) => {
      var data = JSON.parse(data.data)
      if (data.action == 'opponent_disconnect') {
        wx.closeSocket((res) => {
          console.log('WebSocket 已关闭！')
        })

        

        wx.redirectTo({
          url: `/pages/officialExplain/officialExplain`
        })
      }
    })
  }
})